<template>
  <el-row>
    <el-col :span="18">
      <el-select v-model="value" placeholder="选择题库" @click="getDbs">
        <el-option
            v-for="(item,index) in databaseList" :key="index" :label="item" :value="item"/>
      </el-select>
    </el-col>
    <el-col :span="6">
      <el-input
          v-model="input2"
          class="w-50 m-2"
          placeholder="搜索题目或试卷名称关键词"
          :suffix-icon="Search"
      />
    </el-col>
  </el-row>
</template>

<style>

</style>

<script setup>
import {reactive, ref, onMounted, onUpdated,watch} from 'vue'
import {  Search } from '@element-plus/icons-vue'
import useDatabaseStore from "../store/databaseStore";
import useSelectDatabaseStore from "../store/selectDatabaseStore";

const st = useDatabaseStore()
const sd = useSelectDatabaseStore()
const databaseList = ref([])

let value = ref("")

watch(
    () => value.value,
    (newValue) => {
      sd.setDatabase(newValue)
      let res = []
      for (let i = 0; i < st.result.dbs.length; i++) {
        if (st.result.dbs[i].database === value.value){
          res.unshift(st.result.dbs[i])
        }
      }
      sd.setPapers(res)
    }
);

const getDbs = ()=>{
  for (let i = 0; i < st.result.dbs.length; i++) {
    databaseList.value.push(st.result.dbs[i].database)
  }
  databaseList.value = [...new Set(databaseList.value)];
}

</script>
